import {Component, OnInit, ViewChild, ViewEncapsulation} from '@angular/core';
import {MdSidenav} from "@angular/material";
import {Router} from "@angular/router";
import {Category} from "../../shared/Category";

import {Categories} from '../../shared/Category';

const SMALL_WIDTH_BREAKPOINT = 840;



@Component({
  selector: 'app-app-sidenav',
  templateUrl: './app-sidenav.component.html',
  styleUrls: ['./app-sidenav.component.scss'],
  encapsulation: ViewEncapsulation.None
})
export class AppSidenavComponent implements OnInit {

  items: Category[]= Categories;

  @ViewChild(MdSidenav) sidenav: MdSidenav;

  constructor(private _router: Router) { }

  ngOnInit() {
    this._router.events.subscribe(() => {
      if (this.isScreenSmall()) {
        this.sidenav.close();
      }
    })
  }

  //noinspection JSMethodCanBeStatic
  isScreenSmall(): boolean {
    return window.matchMedia(`(max-width: ${SMALL_WIDTH_BREAKPOINT}px`).matches;
  }

}
